{extend name="base"}
{block name="main"}
<style type="text/css">
  .main a{color: #409EFF}
  .main a:hover{text-decoration: underline;}
</style>
<div id="app" v-cloak>
    <el-row class="ws-quote">
        <el-col :span="2" >
            财务统计
        </el-col>
        <el-date-picker
              v-model="params.range"
              type="daterange"
              align="right"
              unlink-panels
              value-format="timestamp"
              size="small"
              range-separator="至"
              start-placeholder="提现时间"
              end-placeholder="提现时间"
              :picker-options="pickerOptions">
        </el-date-picker>
        <el-button type="primary" size="small" @click="search('{:url('')}')">搜索</el-button>
    </el-row>
    <div class="page p_y10">
      <span class="f_r page-total">总收入：<span>{{all.income}}</span></span>
      <span class="f_r page-total">总支出：<span>{{all.expenditure}}</span></span>
      <span class="f_r page-total">共<span>{{total}}</span>期</span>
      <el-pagination
        background
        layout="prev, pager, next"
        :current-page="currentPage"
        @current-change="currentChange"
        :page-size="pageSize"
        :total="total"
        v-if="total>pageSize">
      </el-pagination>
    </div>

    <el-table
        :default-expand-all="false"
        border
        :summary-method="getSummaries"
        show-summary
        class="main"
        :data="tableData"
        style="width: 100%">
        <el-table-column
          label="期数"
          prop="now_time"
          sortable
          :width="120"
          :formatter="numberFormats"
          align="center">
        </el-table-column>
        <el-table-column
          label="{:lang('vip_buy')}"
          prop="vip_buy"
          sortable
          align="center">
          <template scope="r">
            <a :href="'{:url('finance',['type'=>0])}?now_time='+r.row.now_time" v-if="r.row.vip_buy>0">{{r.row.vip_buy}}</a>
            <template v-else>{{r.row.vip_buy}}</template>
          </template>
        </el-table-column>
        <el-table-column
          label="{:lang('bonus_gain')}"
          prop="bonus_gain"
          sortable
          align="center">
          <template scope="r">
            <a :href="'{:url('bonus',['type'=>0])}?now_time='+r.row.now_time" v-if="r.row.bonus_gain>0">{{r.row.bonus_gain}}</a>
            <template v-else>{{r.row.bonus_gain}}</template>
          </template>
        </el-table-column>
        <el-table-column
          label="{:lang('week_bonus_gain')}"
          prop="week_bonus_gain"
          sortable
          align="center">
          <template scope="r">
            <a :href="'{:url('bonus',['type'=>1])}?now_time='+r.row.now_time" v-if="r.row.week_bonus_gain>0">{{r.row.week_bonus_gain}}</a>
            <template v-else>{{r.row.week_bonus_gain}}</template>
          </template>
        </el-table-column>
        <el-table-column
          label="{:lang('agent_bonus')}"
          prop="agent_bonus"
          sortable
          align="center">
          <template scope="r">
            <a :href="'{:url('finance',['type'=>2])}?now_time='+r.row.now_time" v-if="r.row.agent_bonus>0">{{r.row.agent_bonus}}</a>
            <template v-else>{{r.row.agent_bonus}}</template>
          </template>
        </el-table-column>
        <el-table-column
          label="{:lang('task_bonus_money')}"
          prop="bonus_money"
          sortable
          align="center">
          <template scope="r">
            <a :href="'{:url('finance',['type'=>2,'memo'=>'task_bonus_money'])}?now_time='+r.row.now_time" v-if="r.row.bonus_money>0">{{r.row.bonus_money}}</a>
            <template v-else>{{r.row.bonus_money}}</template>
          </template>
        </el-table-column>
        <el-table-column
          label="{:lang('task_bonus_coin')}"
          prop="bonus_coin"
          sortable
          align="center">
          <template scope="r">
            <a :href="'{:url('finance',['type'=>2,'memo'=>'task_bonus_coin'])}?now_time='+r.row.now_time" v-if="r.row.bonus_coin>0">{{r.row.bonus_coin}}</a>
            <template v-else>{{r.row.bonus_coin}}</template>
          </template>
        </el-table-column>
        <el-table-column
          label="{:lang('withdraw_cash')}"
          prop="withdraw_cash"
          sortable
          align="center">
          <template scope="r">
            <a :href="'{:url('cash/log')}?now_time='+r.row.now_time" v-if="r.row.withdraw_cash>0">{{r.row.withdraw_cash}}</a>
            <template v-else>{{r.row.withdraw_cash}}</template>
          </template>
        </el-table-column>
        <el-table-column
          label="{:lang('coin_buy')}"
          prop="coin_buy"
          sortable
          align="center">
          <template scope="r">
            <a :href="'{:url('finance',['type'=>4])}?now_time='+r.row.now_time" v-if="r.row.coin_buy>0">{{r.row.coin_buy}}</a>
            <template v-else>{{r.row.coin_buy}}</template>
          </template>
        </el-table-column>

        <el-table-column
          label="{:lang('income')}"
          prop="income"
          sortable
          align="center">
        </el-table-column>
        <el-table-column
          label="{:lang('expenditure')}"
          prop="expenditure"
          sortable
          align="center">
        </el-table-column>
        <el-table-column
          label="{:lang('profit')}"
          prop="profit"
          sortable
          align="center">
        </el-table-column>
    </el-table>

    <div class="page p_y10">
      <el-pagination
        background
        layout="prev, pager, next"
        :current-page="currentPage"
        @current-change="currentChange"
        :page-size="pageSize"
        :total="total"
        v-if="total>pageSize">
      </el-pagination>
    </div>
</div>
{/block}

<!--------------------------分割线------------------------>
<!--------------------------分割线------------------------>
<!--------------------------分割线------------------------>

{block name="vue"}
<script>
var app=new Vue({
    el:"#app",
    mixins:[wsMixins],
    data:{
        tableData:{$list|raw}, // 列表数据
        all:{$all|raw}, // 
        params:{$params|raw},
        total:{$total},
        pageSize:{:config('paginate.list_rows')},
        currentPage:{:input('page',1)},
    },
    
    methods:{
        numberFormats(row,col,val){
          return this.dateFormat(val*1000,'Y-m-d')
        },
        currentChange(page){
          let query=`?page=${page}&range=${this.params.range}`;
          this.href("{:url('')}"+query);
        },
        getSummaries(param){
          const { columns, data } = param;
          const sums = [];
          const all = this.all;
          let keys=new Set(['raw_money','coupon_money','money']);
          columns.forEach((column, index) => {
            if(index === 0) {
              sums[index] = '总计：';
              return;
            }else if(all[column.property]!==undefined){
              sums[index] =parseFloat(all[column.property]).toFixed(2);
            }else{
              sums[index] = '';
            }
          });
          return sums;
        }
    },
});
</script>
{/block}